
<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<meta name="applicable-device" content="mobile" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>
	<meta name="apple-mobile-web-app-capable" content="yes" />
	<meta name="apple-mobile-web-app-status-bar-style" content="black" />
	<meta name="msapplication-tap-highlight" content="no" />
	<title>员工防疫动态</title>
	<link rel="stylesheet" href="static/css/vue/index.css">
	<script type="text/javascript">
		document.write("<link rel='stylesheet' type='text/css' href='static/css/metro.css?random="+Math.random()+"'/>");
	</script>
	<link rel="stylesheet" type="text/css" href="static/css/loading.css"/>
	<link rel="stylesheet" type="text/css" href="static/css/bootstrap.css"/>
	<script type="text/javascript" src="static/js/jquery-1.11.1.min.js"></script>
	<script type="text/javascript" src="static/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="static/js/echarts.min.js"></script>
	<script type="text/javascript" src="static/app/js/china.js"></script>
	<script type="text/javascript" src="static/js/dateUtil.js"></script>
	<script type="text/javascript">
		document.write("<script type='text/javascript' src='static/js/metro.js?random="+Math.random()+"'></s"+"cript>");
	</script>

	<script src="static/js/vue/vue.js"></script>
	<script src="static/js/vue/index.js"></script>
	<script>
		+ function() {
			remLayout();

			function remLayout() {
				var w = document.documentElement.clientWidth;
				w = w > 768 ? 768 : w;
				w = w <= 320 ? 320 : w;
				document.documentElement.style.fontSize = w / 7.5 + 'px';
			}
			window.addEventListener('resize', function() {
				remLayout();
			}, false);
		}();
	</script>
	<style>
		.metro_body_hidden {
			overflow-y: hidden;
		}
		.metro_body_auto {
			overflow-y: auto;
		}
	</style>
</head>


<body id="metroBody" class="metro_body_hidden">

<div  id="loadDiv" class="bg">
	<div  class="tab_loading">
		加载中。。。
	</div>
</div>

<header>
	<div class="headers" id="headers">
		<div class="text_left">
			<span>上海地铁防疫动态</span>
		</div>
		<div class="text_right">
			<span>统计截止日期</span>
			<div class="hhmm">
				<el-button icon="el-icon-caret-left"  @click="leftButtonClick()" id="leftButton"></el-button>
				<el-date-picker
						:clearable=false
						:editable=false
						v-model="dateValue"
						@change="dateChange"
						:picker-options="pickerOptions"
						type="date"
						placeholder="">
				</el-date-picker>
				<el-button icon="el-icon-caret-right"  @click="rightButtonClick()"  id="rightButton"></el-button>
			</div>
		</div>
		<!--<div  class="switchTab">
			<ul class="nav nav-tabs" id="myTab">
				<li class="active"><a href="#a" aria-controls="a" role="tab" data-toggle="tab">自有员工</a></li>
				<li><a href="#b" aria-controls="b" role="tab" data-toggle="tab">委外人员</a></li>
				<li><a href="#c" aria-controls="c" role="tab" data-toggle="tab">资产委外</a></li>
				<li><a href="#d" aria-controls="d" role="tab" data-toggle="tab">资产商铺</a></li>
			</ul>
		</div>-->
		<!--     		<p class="Subheading">员工防疫动态 -->

		<!-- </p> -->
	</div>
</header>

<div class="tab-content">
	<div class="tab-pane active" id="a">
		<section>
			<ul class="ul">
				<li id="12" class="li" style="height:8.5rem; display: none" >
					<div class="sec_top"  style="margin-top: 0.1rem;">
						<div class="top_one" style="text-align: center;">
							<span id="amountOfNonlocal">0</span>
							<p>在外地总人数</p>
						</div>
						<div class="top_two" style="text-align: center;">
							<span id=totalAmountOfReturn>0</span>
							<p>累计返沪人数</p>
						</div>
						<div class="top_three" style="text-align: center;">
							<span id="totalAmountOfWork">0</span>
							<p>累计返岗人数</p>
						</div>
					</div>
					<div class="sec_x" style="margin: 0.1rem auto;"></div>
					<div class="sec_top">
						<div class="top_one" style="text-align: center;">
							<span id="totalAmountFOfever" style="color:rgba(208,83,0,1);">0</span>
							<p>累计发热人数</p>
						</div>
						<div class="top_one" style="text-align: center;">
							<span id="totalAmountOfSeemingly"  style="color:rgba(242,159,0,1);">0</span>
							<p>累计疑似病例人数</p>
						</div>
						<div class="top_two" style="text-align: center;">
							<span id=totalAmountOfConfirmed  style="color:rgba(119,3,63,1);">0</span>
							<p>累计确诊人数</p>
						</div>
						<div class="top_three" style="text-align: center;">
							<span id="totalAmountOfCured"  style="color:rgba(0,149,14,1);">0</span>
							<p>累计治愈人数</p>
						</div>
					</div>
					<div class="sec_two_header" style="margin-top: 0.1rem; ">
						<img src="static/img/ico.png"/>
						<span>申通地铁员工分布</span>
					</div>
					<div class="sec_x" style="margin-top: -0.1rem;"></div>
					<div class="sec_map" id="mapOwn"></div>
				</li>
				<li id="1" style="display: none" >
					<div class="sec_two">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>外出</span>
						</div>
						<div class="sec_x" style="position: relative;top: -0.5rem;"></div>
						<div class="sec_out" id="pieOne"></div>
					</div>
				</li>
				<li id="2" style="display: none">
					<div class="sec_two">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>回沪</span>
						</div>
						<div class="sec_x" style="position: relative;top: -0.5rem;"></div>
						<div class="sec_out" id="pieTwo"></div>
					</div>
				</li>
				<li id="3" style="display: none">
					<div class="sec_two">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>返岗</span>
						</div>
						<div class="sec_x" style="position: relative;top: -0.5rem;"></div>
						<div class="sec_out" id="pieThree">
						</div>
					</div>
				</li>
				<li id="4" style="display: none">
					<div class="sec_twos">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>运营公司当日数据</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem!important;"></div>
						<div class="sec_out table-responsive" id="sec_three" style="overflow: auto;">
							<table class="table table-striped table-bordered" >
								<thead>
								<tr>
									<th style='text-align: center; font-size: 6px;'>单位名称</th>
									<th style='text-align: center; font-size: 6px;'>外出总人数</th>
									<th style='text-align: center; font-size: 6px;'>返岗人数</th>
									<th style='text-align: center; font-size: 6px;'>返岗率</th>
									<th style='text-align: center; font-size: 6px;'>昨日返沪</th>
									<th style='text-align: center; font-size: 6px;'>今日返沪</th>
									<th style='text-align: center; font-size: 6px;'>昨日返岗</th>
									<th style='text-align: center; font-size: 6px;'>今日返岗</th>
								</tr>
								</thead>
								<tbody style='text-align: center;  font-size: 6px;' id="yygsbgbody">
								</tbody>
							</table>
						</div>
					</div>
				</li>
				<li id="5" style="display: none">
					<div class="sec_two"  style="height: 8rem!important;">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>运营公司员工外出返岗</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem;"></div>
						<div class="sec_out" id="mains_one" style="height: 7rem !important;position: relative;top: 0.4rem;"></div>
					</div>
				</li>
				<li id="6" style="display: none">
					<div class="sec_two" style="height: 8rem!important;">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>运营公司人员上岗趋势</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem;"></div>
						<div class="sec_out" id="main_four" style="height: 7rem !important;position: relative;top: 0.4rem;"></div>
					</div>
				</li>
				<li id="7" style="display: none">
					<div class="sec_twos">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>非运营公司当日数据</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem!important;"></div>
						<div class="sec_out table-responsive" id="sec_three" style="overflow: auto;">
							<table class="table table-striped table-bordered" >
								<thead>
								<tr>
									<th style='text-align: center; font-size: 6px;'>单位名称</th>
									<th style='text-align: center; font-size: 6px;'>外出总人数</th>
									<th style='text-align: center; font-size: 6px;'>返岗人数</th>
									<th style='text-align: center; font-size: 6px;'>返岗率</th>
									<th style='text-align: center; font-size: 6px;'>昨日返沪</th>
									<th style='text-align: center; font-size: 6px;'>今日返沪</th>
									<th style='text-align: center; font-size: 6px;'>昨日返岗</th>
									<th style='text-align: center; font-size: 6px;'>今日返岗</th>
								</tr>
								</thead>
								<tbody style='text-align: center;  font-size: 6px;' id="fyygsbgbody">
								</tbody>
							</table>
						</div>
					</div>
				</li>
				<li id="8" style="display: none">
					<div class="sec_two"  style="height: 8rem!important;">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>非运营公司员工外出返岗</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem;"></div>
						<div class="sec_out" id="mains_two" style="height: 7rem !important;position: relative;top: 0.4rem;"></div>
					</div>
				</li>
				<li id="9" style="display: none">
					<div class="sec_two"  style="height: 8rem!important;">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>非运营公司员工上岗趋势</span>
						</div>
						<div class="sec_x" style="position: relative;top: -0.5rem;"></div>
						<div class="sec_out" id="main_five" style="height: 7rem !important;"></div>
					</div>
				</li>



				<li id="10" class="li" style="overflow:auto;">
					<div class="sec_top">
						<div class="top_one" style="text-align: center;height: 100%">
							<span id="titleLabA">员工队伍疫情防控工作</span>
						</div>
					</div>
					<div class="sec_x" style="margin: 0.1rem auto;"></div>
					<div class="sec_two_header" style="margin-top: 0.1rem;">
						<img src="static/img/ico.png"/>
						<span>填报内容</span>
					</div>
					<div class="sec_x" style="margin-top: -0.1rem;"></div>
					<div class="sec_map" id="modelA">
					</div>
				</li>
				
				<li >
					<div class="sec_twos">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>外来人员培训当日数据</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem!important;"></div>
						<div class="sec_out table-responsive" id="sec_three" style="overflow: auto;">
							<table class="table table-striped table-bordered" >
								<thead>
								<tr>
									<th style='text-align: center; font-size: 6px;'>委托方</th>
									<th style='text-align: center; font-size: 6px;'>培训专业</th>
									<th style='text-align: center; font-size: 6px;'>计划开始日期</th>
									<th style='text-align: center; font-size: 6px;'>计划结束日期</th>
									<th style='text-align: center; font-size: 6px;'>培训人数</th>
									<th style='text-align: center; font-size: 6px;'>本日增加人数</th>
									<th style='text-align: center; font-size: 6px;'>本日减少人数</th>
								</tr>
								</thead>
								<tbody style='text-align: center;  font-size: 6px;' id="pxbgbody">
								</tbody>
							</table>
						</div>
					</div>
				</li>
				<li id="11" style="display: none">
					<div class="sec_two" style="height: 8rem!important;">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>防疫情况趋势图</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem;"></div>
						<div class="sec_out" id="main_six" style="height:7rem!important;position: relative;top: 0.4rem;"></div>
					</div>
				</li>





			</ul>
		</section>
	</div>
	<!--<div class="tab-pane" id="b">
		<section>
			<ul class="ul">
				<li class="li" style="height:8.5rem;">
					<div class="sec_top"  style="margin-top: 0.1rem;">
						<div class="top_one" style="text-align: center;">
							<span id="amountOfNonlocalEpiboly">0</span>
							<p>在外地总人数</p>
						</div>
						<div class="top_two" style="text-align: center;">
							<span id="totalAmountOfReturnEpiboly">0</span>
							<p>累计返沪人数</p>
						</div>
						<div class="top_three" style="text-align: center;">
							<span id="totalAmountOfWorkEpiboly">0</span>
							<p>累计返岗人数</p>
						</div>
					</div>
					<div class="sec_x" style="margin: 0.1rem auto;"></div>
					<div class="sec_top">
						<div class="top_one" style="text-align: center;">
							<span id="totalAmountFOfeverEpiboly" style="color:rgba(208,83,0,1);">0</span>
							<p>累计发热人数</p>
						</div>
						<div class="top_one" style="text-align: center;">
							<span id="totalAmountOfSeeminglyEpiboly"  style="color:rgba(242,159,0,1);">0</span>
							<p>累计疑似病例人数</p>
						</div>
						<div class="top_two" style="text-align: center;">
							<span id="totalAmountOfConfirmedEpiboly"  style="color:rgba(119,3,63,1);">0</span>
							<p>累计确诊人数</p>
						</div>
						<div class="top_three" style="text-align: center;">
							<span id="totalAmountOfCuredEpiboly"  style="color:rgba(0,149,14,1);">0</span>
							<p>累计治愈人数</p>
						</div>
					</div>
					<div class="sec_two_header" style="margin-top: 0.1rem;">
						<img src="static/img/ico.png"/>
						<span>委外员工分布</span>
					</div>
					<div class="sec_x" style="margin-top: -0.1rem;"></div>
					<div class="sec_map" id="mapEpiboly"></div>
				</li>
				<li>
					<div class="sec_two">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>外出</span>
						</div>
						<div class="sec_x" style="position: relative;top: -0.5rem;"></div>
						<div class="sec_out" id="pieOneEpiboly"></div>
					</div>
				</li>
				<li>
					<div class="sec_two">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>回沪</span>
						</div>
						<div class="sec_x" style="position: relative;top: -0.5rem;"></div>
						<div class="sec_out" id="pieTwoEpiboly"></div>
					</div>
				</li>
				<li>
					<div class="sec_two">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>返岗</span>
						</div>
						<div class="sec_x" style="position: relative;top: -0.5rem;"></div>
						<div class="sec_out" id="pieThreeEpiboly">
						</div>
					</div>
				</li>
				<li>
					<div class="sec_twos">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>委外员工当日数据</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem!important;"></div>
						<div class="sec_out table-responsive" id="sec_three" style="overflow: auto;">
							<table class="table table-striped table-bordered" >
								<thead>
								<tr>
									<th style='text-align: center; font-size: 6px;'>单位名称</th>
									<th style='text-align: center; font-size: 6px;'>外出总人数</th>
									<th style='text-align: center; font-size: 6px;'>返岗人数</th>
									<th style='text-align: center; font-size: 6px;'>返岗率</th>
									<th style='text-align: center; font-size: 6px;'>昨日返沪</th>
									<th style='text-align: center; font-size: 6px;'>今日返沪</th>
									<th style='text-align: center; font-size: 6px;'>昨日返岗</th>
									<th style='text-align: center; font-size: 6px;'>今日返岗</th>
								</tr>
								</thead>
								<tbody style='text-align: center;  font-size: 6px;' id="weiwaiReportBody">
								</tbody>
							</table>
						</div>
					</div>
				</li>
				<li>
					<div class="sec_two"  style="height: 8rem!important;">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>委外员工公司外出返岗</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem;"></div>
						<div class="sec_out" id="returnWorkWeiwai" style="height: 7rem !important;position: relative;top: 0.4rem;"></div>
					</div>
				</li>
				<li>
					<div class="sec_two" style="height: 8rem!important;">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>委外公司人员上岗趋势</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem;"></div>
						<div class="sec_out" id=trendWeiwai style="height: 7rem !important;position: relative;top: 0.4rem;"></div>
					</div>
				</li>
				<li>
					<div class="sec_two" style="height: 8rem!important;">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>防疫情况趋势图</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem;"></div>
						<div class="sec_out" id="fyqsWeiwai" style="height: 7rem !important; position: relative;top: 0.4rem;"></div>
					</div>
				</li>
			</ul>
		</section>
	</div>
	<div class="tab-pane" id="c">
		<section>
			<ul class="ul">
				<li class="li" style="height:8.5rem;">
					<div class="sec_top"  style="margin-top: 0.1rem;">
						<div class="top_one" style="text-align: center;">
							<span id="amountOfNonlocalAsset">0</span>
							<p>在外地总人数</p>
						</div>
						<div class="top_two" style="text-align: center;">
							<span id="totalAmountOfReturnAsset">0</span>
							<p>累计返沪人数</p>
						</div>
						<div class="top_three" style="text-align: center;">
							<span id="totalAmountOfWorkAsset">0</span>
							<p>累计返岗人数</p>
						</div>
					</div>
					<div class="sec_x" style="margin: 0.1rem auto;"></div>
					<div class="sec_top">
						<div class="top_one" style="text-align: center;">
							<span id="totalAmountFOfeverAsset" style="color:rgba(208,83,0,1);">0</span>
							<p>累计发热人数</p>
						</div>
						<div class="top_one" style="text-align: center;">
							<span id="totalAmountOfSeeminglyAsset"  style="color:rgba(242,159,0,1);">0</span>
							<p>累计疑似病例人数</p>
						</div>
						<div class="top_two" style="text-align: center;">
							<span id="totalAmountOfConfirmedAsset"  style="color:rgba(119,3,63,1);">0</span>
							<p>累计确诊人数</p>
						</div>
						<div class="top_three" style="text-align: center;">
							<span id="totalAmountOfCuredAsset"  style="color:rgba(0,149,14,1);">0</span>
							<p>累计治愈人数</p>
						</div>
					</div>
					<div class="sec_two_header" style="margin-top: 0.1rem;">
						<img src="static/img/ico.png"/>
						<span>申通地铁资产委外员工分布</span>
					</div>
					<div class="sec_x" style="margin-top: -0.1rem;"></div>
					<div class="sec_map" id="mapAsset"></div>
				</li>
				<li>
					<div class="sec_two">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>外出</span>
						</div>
						<div class="sec_x" style="position: relative;top: -0.5rem;"></div>
						<div class="sec_out" id="pieOneAsset"></div>
					</div>
				</li>
				<li>
					<div class="sec_two">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>回沪</span>
						</div>
						<div class="sec_x" style="position: relative;top: -0.5rem;"></div>
						<div class="sec_out" id="pieTwoAsset"></div>
					</div>
				</li>
				<li>
					<div class="sec_two">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>返岗</span>
						</div>
						<div class="sec_x" style="position: relative;top: -0.5rem;"></div>
						<div class="sec_out" id="pieThreeAsset">
						</div>
					</div>
				</li>
				<li>
					<div class="sec_twos">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>资产公司委外当日数据</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem!important;"></div>
						<div class="sec_out table-responsive" id="sec_three" style="overflow: auto;">
							<table class="table table-striped table-bordered" >
								<thead>
								<tr>
									<th style='text-align: center; font-size: 6px;'>单位名称</th>
									<th style='text-align: center; font-size: 6px;'>外出总人数</th>
									<th style='text-align: center; font-size: 6px;'>返岗人数</th>
									<th style='text-align: center; font-size: 6px;'>返岗率</th>
									<th style='text-align: center; font-size: 6px;'>昨日返沪</th>
									<th style='text-align: center; font-size: 6px;'>今日返沪</th>
									<th style='text-align: center; font-size: 6px;'>昨日返岗</th>
									<th style='text-align: center; font-size: 6px;'>今日返岗</th>
								</tr>
								</thead>
								<tbody style='text-align: center;  font-size: 6px;' id="assetReportBody">
								</tbody>
							</table>
						</div>
					</div>
				</li>
				<li>
					<div class="sec_two"  style="height: 8rem!important;">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>资产公司委外外出人员返岗</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem;"></div>
						<div class="sec_out" id="returnWorkAsset" style="height: 7rem !important;position: relative;top: 0.4rem;"></div>
					</div>
				</li>
				<li>
					<div class="sec_two" style="height: 8rem!important;">
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>资产公司委外人员上岗趋势</span>
						</div>
						<div class="sec_x" style="margin-top: -0.1rem;"></div>
						<div class="sec_out" id="trendAsset" style="height: 7rem !important;position: relative;top: 0.4rem;"></div>
					</div>
				</li>
				&lt;!&ndash;     		<li> &ndash;&gt;
				&lt;!&ndash;     			<div class="sec_two" style="height: 8rem!important;"> &ndash;&gt;
				&lt;!&ndash;     				<div class="sec_two_header"> &ndash;&gt;
				&lt;!&ndash;     					<img src="static/img/ico.png"/> &ndash;&gt;
				&lt;!&ndash;     					<span>防疫情况趋势图</span> &ndash;&gt;
				&lt;!&ndash;     				</div> &ndash;&gt;
				&lt;!&ndash;     				<div class="sec_x" style="margin-top: -0.1rem;"></div> &ndash;&gt;
				&lt;!&ndash;     				<div class="sec_out" id="fyqsAsset" style="height: 7rem !important; position: relative;top: 0.4rem;"></div> &ndash;&gt;
				&lt;!&ndash;     			</div> &ndash;&gt;
				&lt;!&ndash;     		</li> &ndash;&gt;
			</ul>
		</section>
	</div>
	<div class="tab-pane" id="d">
		<section>
			<ul class="ul">
				<li class="li" style="height:7.5rem;">
					<div class="sec_top"   style="margin-top: 0.1rem;">
						<div class="top_one" style="text-align: center;">
							<span id="shopReturnWork">0</span>
							<p>今日营业员总人数</p>
						</div>
						<div class="top_two" style="text-align: center;">
							<span id="shopOutReturnWork">0</span>
							<p>外地返岗人数</p>
						</div>
					</div>
					<div class="sec_two_header" style="margin-top: 0.1rem;">
						<img src="static/img/ico.png"/>
						<span>申通地铁资产商铺营业员分布</span>
					</div>
					<div class="sec_x" style="margin-top: -0.1rem;"></div>
					<div class="sec_map" id="mapShops"></div>
				</li>
				<li>
					<div class="sec_two">
						<div class="sec_top" style="margin-top: 0.1rem;">


						</div>
						<div class="sec_two_header">
							<img src="static/img/ico.png"/>
							<span>外出</span>
						</div>
						<div class="sec_x" style="position: relative;top: -0.5rem;"></div>
						<div class="sec_out" id="pieShops"></div>
					</div>
				</li>
			</ul>
		</section>
	</div>-->
</div>
</body>
<script type="text/javascript">
	var currentPage=1;
	new Vue({
		el: '#headers',
		data: function() {
			var day = new Date();
			day.setTime(day.getTime());
			//如果是最近一天，右侧按钮不能点击
			if(day>new Date(new Date(new Date().toLocaleDateString()).getTime())){
				$("#rightButton").attr("disabled","disabled");
				$("#rightButton").css("color","grey");
			}
			return {
				pickerOptions: {
					disabledDate: (time) => {
						//限制查询时间不能大于昨天
						return time>day;
					}
				},
				dateValue: day
			}
		},
		mounted(){
			window.dateChange = this.dateChange; // 方法赋值给window调用
			window.conditionDate = this.dateValue;
		},
		methods: {
			leftButtonClick(){
				//时间控件减少一天
				this.dateValue = new Date((this.dateValue.getTime()-24*60*60*1000));
				this.dateChange();

				if(this.dateValue<1606060800000){
					$("#1").css('display','block');
					$("#2").css('display','block');
					$("#3").css('display','block');
					$("#4").css('display','block');
					$("#5").css('display','block');
					$("#6").css('display','block');
					$("#7").css('display','block');
					$("#8").css('display','block');
					$("#9").css('display','block');
					$("#10").css('display','none');
					$("#11").css('display','block');
					$("#12").css('display','block');
				}
			},
			rightButtonClick(){
				//时间控件减少一天
				this.dateValue = new Date((this.dateValue.getTime()+24*60*60*1000));
				this.dateChange();
				if(this.dateValue>=1606060800000){
					$("#1").css('display','none');
					$("#2").css('display','none');
					$("#3").css('display','none');
					$("#4").css('display','none');
					$("#5").css('display','none');
					$("#6").css('display','none');
					$("#7").css('display','none');
					$("#8").css('display','none');
					$("#9").css('display','none');
					$("#10").css('display','block');
					$("#11").css('display','none');
					$("#12").css('display','none');
				}


			},
			dateChange(){
				if(this.dateValue>=new Date(new Date(new Date().toLocaleDateString()).getTime())){
					$("#rightButton").attr("disabled","disabled");
					$("#rightButton").css("color","grey");
					$("#rightButton").addClass("is-disabled");
					if(this.dateValue<1606060800000){
						$("#1").css('display','block');
						$("#2").css('display','block');
						$("#3").css('display','block');
						$("#4").css('display','block');
						$("#5").css('display','block');
						$("#6").css('display','block');
						$("#7").css('display','block');
						$("#8").css('display','block');
						$("#9").css('display','block');
						$("#10").css('display','none');
						$("#11").css('display','block');
						$("#12").css('display','block');
					}else {
						$("#1").css('display','none');
						$("#2").css('display','none');
						$("#3").css('display','none');
						$("#4").css('display','none');
						$("#5").css('display','none');
						$("#6").css('display','none');
						$("#7").css('display','none');
						$("#8").css('display','none');
						$("#9").css('display','none');
						$("#10").css('display','block');
						$("#11").css('display','none');
						$("#12").css('display','none');
					}

				}else{
					$("#rightButton").attr("disabled",false);
					$("#rightButton").css("color","#8BC8FA");
					$("#rightButton").removeClass("is-disabled");
					if(this.dateValue>=1606060800000){
						$("#1").css('display','none');
						$("#2").css('display','none');
						$("#3").css('display','none');
						$("#4").css('display','none');
						$("#5").css('display','none');
						$("#6").css('display','none');
						$("#7").css('display','none');
						$("#8").css('display','none');
						$("#9").css('display','none');
						$("#10").css('display','block');
						$("#11").css('display','none');
						$("#12").css('display','none');
					}else {
						$("#1").css('display','block');
						$("#2").css('display','block');
						$("#3").css('display','block');
						$("#4").css('display','block');
						$("#5").css('display','block');
						$("#6").css('display','block');
						$("#7").css('display','block');
						$("#8").css('display','block');
						$("#9").css('display','block');
						$("#10").css('display','none');
						$("#11").css('display','block');
						$("#12").css('display','block');
					}

				}

				conditionDate = this.dateValue;
				//判断当前所处页面
				if(currentPage==1){
					ownEmployee();
				}else if(currentPage==2){
					epibolyEmployee();
				}else if(currentPage==3){
					assetEpiboly();
				}else if(currentPage==4){
					assetShops();
				}
			}

		}
	});

	// var _PageHeight = document.documentElement.clientHeight,
	// _PageWidth = document.documentElement.clientWidth;
	// //计算loading框距离顶部和左部的距离（loading框的宽度为215px，高度为61px）
	// var _LoadingTop = _PageHeight > 61 ? (_PageHeight - 61) / 2 : 0,
	// _LoadingLeft = _PageWidth > 215 ? (_PageWidth - 215) / 2 : 0;
	// //在页面未加载完毕之前显示的loading Html自定义内容
	// var _LoadingHtml = '<div id="loadingDiv" class="mask" style="position:absolute;left:0;width:100%;height:' + _PageHeight + 'px;top:0;background:#f3f8ff;opacity:0.8;filter:alpha(opacity=80);z-index:10000;"><div style="position: absolute; cursor1: wait; left: ' + _LoadingLeft + 'px; top:' + _LoadingTop + 'px; width: auto; height: 57px; line-height: 57px; padding-left: 50px; padding-right: 5px; background: #fff url(static/img/header.png) no-repeat scroll 5px 10px; border: 2px solid #95B8E7; color: #696969; font-family:\'Microsoft YaHei\';">页面加载中，请等待...</div></div>';
	// //呈现loading效果
	// document.write(_LoadingHtml);
	// //window.onload = function () {
	// //  var loadingMask = document.getElementById('loadingDiv');
	// //  loadingMask.parentNode.removeChild(loadingMask);
	// //};
	// //监听加载状态改变
	// document.onreadystatechange = completeLoading;
	// //加载状态为complete时移除loading效果
	// function completeLoading() {
	// 	if (document.readyState == "complete") {
	// 		var loadingMask = document.getElementById('loadingDiv');
	// 		loadingMask.parentNode.removeChild(loadingMask);
	// 	}
	//
	// }
</script>
</html>

